<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>标记图层支持的事件</title>
    <style type="text/css">
        body{
            margin: 0;
            overflow: hidden;
            background: #fff;
        }
        #map{
            position: relative;
            height: 520px;
            border:1px solid #3473b7;
        }
    </style>
    <script src = '../libs/SuperMap.Include.js'></script>
    <script type="text/javascript">
        var map,layer, markerlayer ,marker,
        host = document.location.toString().match(/file:\/\//) ? "http://localhost:8090" : 'http://' + document.location.host;
        url = host + "/iserver/services/map-world/rest/maps/World";

        function init()
        {
            map = new SuperMap.Map("map",{controls:[
                new SuperMap.Control.Zoom() ,
                new SuperMap.Control.Navigation() ,
                new SuperMap.Control.LayerSwitcher()
            ]});
            layer= new SuperMap.Layer.TiledDynamicRESTLayer("World", url, null,{maxResolution:"auto"});
            markerlayer = new  SuperMap.Layer.Markers("markerLayer");
            layer.events.on({"layerInitialized":addLayer});
            addData();
        }
        function addLayer(){

            map.addLayers([layer,markerlayer]);
            //显示地图范围
            map.setCenter(new SuperMap.LonLat(0, 0), 0);
        }
        //添加数据
        function addData()
        {   markerlayer.removeMarker(marker);
            var size = new SuperMap.Size(44,33);
            var offset = new SuperMap.Pixel(-(size.w/2), -size.h);
            var icon = new SuperMap.Icon('../theme/images/marker.png', size, offset);
             marker =new SuperMap.Marker(new SuperMap.LonLat(0,0),icon) ;
           marker.events.on({
               "click":openInfoWin,
               "touchstart":openInfoWin,    //假如要在移动端的浏览器也实现点击弹框，则在注册touch类事件
               "scope": marker
           });
           markerlayer.addMarker(marker);

        }
        //打开对应的信息框
        var infowin = null;
        function   openInfoWin()
        {
            closeInfoWin();
            var marker = this;
            var lonlat = marker.getLonLat();
            var size = new SuperMap.Size(0, 33);
            var offset = new SuperMap.Pixel(11, -30);
            var icon = new SuperMap.Icon("../theme/images/marker.png", size, offset);
            var popup = new SuperMap.Popup.FramedCloud("popwin",
                    new SuperMap.LonLat(lonlat.lon,lonlat.lat),
                    null,
                    "鼠标点击事件 ",
                    icon,
                    true);
            infowin = popup;
            map.addPopup(popup);
        }
        //关闭信息框
        function closeInfoWin(){
            if(infowin){
                try{
                    infowin.hide();
                    infowin.destroy();
                }
                catch(e){}
            }
        }
    </script>
</head>
<body onload="init()" >
<div id="map"></div>

</body>
</html>